@import 'scmanage.theme.less';

@scroll-horizontal-width: 1px;
@scroll-vertical-height: 5px;
@scroll-background: rgba(0, 0, 0, 0.2);
@scroll-background-hover: rgba(0, 0, 0, 0.3);

@display-box: flex;

/* 公共纵向弹性盒 */
.getDisplay() {
  display: flex;
  flex-direction: column;
}

/* 获取overflow属性 */
.getOverFlowXY() {
  overflow-y: auto;
  overflow-x: hidden;
}

/*公共切换字体样式*/
.commonSwitchFont() {
  font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
  font-weight: 700;
  // text-align: center;
  text-align: left;
  transition: 300ms;
  font-style: normal;
  cursor: pointer;
}

#page-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: rgb(0, 0, 0, 0);

  :global {
    .ant-card-body {
      flex: auto;
      overflow: auto;
    }
  }
}

#page-layout {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* 页面列表视图 样式 */
.list-layout {
  height: 100%;
  .getDisplay();

  .list-layout-overflow {
    flex: auto;
    margin-top: 4px;
    overflow: auto;

    .list-layout-tableCard {
      height: 100%;

      .ant-card-body {
        height: 100%;
        .getDisplay();
        padding: 0px;
      }

      /* 表格外层div样式*/

      .list-layout-table {
        flex: auto;
        .getOverFlowXY();
      }

      /* 卡片；列表外层样式 */

      .list-layout-card {
        flex: auto;
        padding: 8px 16px;
        .getOverFlowXY();
      }
    }
  }

  .list-layout-auto {
    flex: auto;
  }
}

/* 表格样式修改  */
.list-table-schemaTable {
  height: 100%;

  .ant-table-wrapper {
    height: 100%;

    .ant-spin-nested-loading {
      //表格loading样式
      height: 100%;

      .ant-spin-container {
        //表格loading样式
        height: 100%;
        .getDisplay();

        .ant-table {
          //表格样式
          flex: auto;
          overflow-y: auto;
          overflow-x: hidden;
          margin: 0px 16px;

          .ant-table-container {
            //表格容器样式
            height: 100%;
            .getDisplay();
            border: none;

            .ant-table-header {
              //表格头样式
              // overflow: initial !important;
              border-bottom: 1px solid #f0f0f0;

              // .ant-table-column-title {
              //   white-space: nowrap;
              //   overflow: hidden;
              // }

              .ant-table-thead {
                tr {
                  > :nth-of-type(1) {
                    border-left: 1px solid #f0f0f0;
                  }
                }
              }

              // .ant-table-cell-fix-right-first {
              //   right: 0px !important;
              // }
            }

            .ant-table-body {
              flex: auto;
              height: inherit;
              //border-right: 1px solid #f0f0f0;

              .rowClassBackground {
                background-color: #f6f6f6;

                .ant-table-cell-fix-left,
                .ant-table-cell-fix-right {
                  background-color: #f6f6f6;
                }
              }

              .ant-table-cell-with-append {
                // display: flex;

                .ant-table-row-expand-icon {
                  margin-top: 5px;
                }
              }

              table {
                .ant-table-tbody {
                  .ant-table-row {
                    > :nth-of-type(1) {
                      border-left: 1px solid #f0f0f0;
                    }
                  }

                  .ant-table-placeholder {
                    .ant-table-cell {
                      .ant-table-expanded-row-fixed {
                        border-left: 1px solid #f0f0f0;
                        border-right: 1px solid #f0f0f0;
                        margin: -8px -8px;
                      }

                      .ant-table-expanded-row-fixed::after {
                        border-right: none;
                      }
                    }
                  }
                }
              }
            }

            .ant-table-body::-webkit-scrollbar {
              width: @scroll-horizontal-width;
              height: @scroll-vertical-height;
            }

            .ant-table-body::-webkit-scrollbar-thumb {
              -webkit-transition: all 0.25s;
              background: @scroll-background;
              transition: all 0.25s;
              border-radius: 0px;
            }

            .ant-table-body::-webkit-scrollbar-thumb:hover {
              background: @scroll-background-hover;
            }
          }
        }

        /**
        *  表格分页器样式
        */
        .ant-pagination {
          margin: 0px;
          padding: 16px 16px;
          background-color: #fcfcfc;
          border-top: 1px solid #eaeaea;
        }
      }
    }
  }
}

/* 列表样式 */
.list-card {
  height: 100%;
  .getDisplay();

  .list-card-list {
    flex: auto;
    border: 1px solid #f0f0f0;
    overflow-y: auto;
    overflow-x: hidden;

    :global {
      .ant-spin-nested-loading {
        height: 100%;

        .ant-spin-container {
          height: 100%;
        }
      }
    }
  }

  .list-card-content {
    width: 60%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .list-card-pagination {
    padding: 8px;
    display: flex;
    justify-content: flex-end;
  }
}

/* table内容样式溢出隐藏 */
.over-flow-hidden {
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 搜索盒子样式 */
.search-box {
  padding: 0px;

  .search-box-switchCompon {
    background: #f9f9f9;
    padding: 8px 16px;
    border-bottom: 1px solid #ececec;
    color: #666666;
    width: 100%;
    // display: grid;
    // grid-template-columns: repeat(16, 5.25%);

    .ant-space-item {
      white-space: nowrap;
    }

    .switch-font {
      .commonSwitchFont();
    }

    .switch-font-target {
      .commonSwitchFont();
    }
  }

  .search-box-form-layout {
    width: 100%;
    padding: 16px;
    display: flex;

    .search-box-form {
      flex: auto;
      margin-right: 8px;

      .ant-form {
        .ant-row {
          row-gap: 0px !important;
        }

        .ant-form-item {
          margin: 0px;
        }
      }
    }

    .search-box-btn {
      white-space: nowrap;
      display: flex;
      align-items: center;

      button {
        margin-right: 8px;
      }

      #filter-btn {
        // font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
        // font-weight: 700;
        margin: 0px;
      }
    }
  }
}

/* 操作按钮样式 */
@border-color: rgb(236, 236, 236);

.action-btn-layout {
  width: 100%;
  padding: 8px 16px;
  //background: #ffffff;
  display: flex;

  .action-btn-opt {
    flex: auto;
    display: flex;
    align-items: center;

    .action-btn-child {
      margin-right: 8px;
    }
  }

  .action-btn-table {
    display: flex;
    align-items: center;
  }
}

/**
高级筛选表单类名
*/

.drawer-form-item {
  .ant-form-item-label {
    label {
      width: 100%;

      .ant-tag {
        margin: 0;
      }
    }
  }
}

.filter-drawer-title {
  width: 100%;
  height: 26px;

  .ant-ribbon-wrapper {
    height: 100%;
    width: 100%;

    .ant-ribbon {
      top: 0px;
      height: 26px;
      line-height: 26px;
    }
  }
}

.filter-drawer {
  .ant-drawer-header-title {
    width: 100%;
    height: 100%;

    .ant-drawer-title {
      width: 100%;
      height: 100%;
    }
  }
}

.searchForm-treeSelect {
  :global {
    .ant-select-selection-overflow {
      flex-wrap: nowrap;
      overflow: auto;
      cursor: pointer;
    }

    .ant-select-selection-overflow::-webkit-scrollbar {
      width: @scroll-horizontal-width;
      height: 0px;
    }

    .ant-select-selection-overflow::-webkit-scrollbar-thumb {
      -webkit-transition: all 0.25s;
      background: @scroll-background;
      transition: all 0.25s;
      border-radius: 0px;
    }

    .ant-select-selection-overflow::-webkit-scrollbar-thumb:hover {
      background: @scroll-background-hover;
    }
  }
}

.searchForm-treeSelect-popupClass {
  :global {
    .ant-select-tree-node-content-wrapper {
      overflow: hidden;
    }
  }
}

// 封装的省市区联动 滚动条样式修改
.ant-select-dropdown {
  padding: 0;

  .ant-cascader-menus {
    .ant-cascader-menu::-webkit-scrollbar {
      width: 5px;
      height: @scroll-vertical-height;
    }

    .ant-cascader-menu::-webkit-scrollbar-thumb {
      -webkit-transition: all 0.25s;
      background: @scroll-background;
      transition: all 0.25s;
      border-radius: 50px;
    }

    .ant-cascader-menu::-webkit-scrollbar-thumb:hover {
      background: @scroll-background-hover;
    }

    .ant-cascader-menu {
      margin: 0;
    }
  }
}

/** 数值范围大小样式 */
.searchForm-numberRanage {
  :global {
    .searchForm-numberRanage-leftNumber {
      .ant-form-item {
        margin: 0px;
      }

      .ant-input-number {
        width: 100%;
        border-right: none;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
      }
    }

    .searchForm-numberRanage-centerNumber {
      display: flex;
      justify-content: center;
      align-items: center;
      border-top: 1px solid #d9d9d9;
      border-bottom: 1px solid #d9d9d9;
    }

    .searchForm-numberRanage-rightNumber {
      .ant-form-item {
        margin: 0px;
      }

      .ant-input-number {
        width: 100%;
        border-left: none;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
      }
    }
  }
}
